<template>
	<view class="content">
		<view class="status_bar"></view>
		<Head :webtext="webtext"></Head>
		<view class="body">
			<u-form class="form" ref="uForm" label-position="top" :label-style="labelStyle">
				<u-form-item label="旧密码">
					<u-input
						class="input"
						:password-icon="false"
						:clearable="false"
						v-model="oldpassword"
						placeholder="请输入旧密码"
						type="text"
						placeholder-style="fontSize: 20upx;"
					/>
				</u-form-item>
				<u-form-item label="新密码">
					<u-input
						class="input"
						:password-icon="false"
						:clearable="false"
						v-model="password"
						placeholder="请输入新密码"
						type="text"
						placeholder-style="fontSize: 20upx"
					/>
				</u-form-item>
				<u-form-item label="重复密码">
					<u-input
						class="input"
						:password-icon="false"
						:clearable="false"
						v-model="repassword"
						placeholder="请再次输入密码"
						type="text"
						placeholder-style="fontSize: 20upx"
					/>
				</u-form-item>
				<view class="button" @click="submit">确定</view>
			</u-form>
			<u-toast ref="uToast" :icon="false" />
		</view>
	</view>
</template>

<script>
import Head from '../../components/head.vue';
export default {
	components: {
		Head
	},
	data() {
		return {
			webtext: '修改登录密码',
			oldpassword: '',
			password: '',
			repassword: '',
			labelStyle: {
				color: '#fff',
				fontSize: '34upx',
				lineHeight: '42upx'
			}
		};
	},
	methods: {
		submit() {
			if(this.oldpassword && this.password && this.repassword){
				if(this.password == this.repassword){
					this.$u.api.editpassword({
						oldpassword: this.oldpassword,
						password: this.password,
						repassword: this.repassword
					}).then(res => {
						uni.showToast({
							title: "密码修改成功",
							duration: 1000,
							icon: 'none'
						});
						uni.removeStorageSync('Authorized');	
						setTimeout(()=>{
							uni.switchTab({
								url:"/pages/index/index"
							})
						},1000)
					})
				}else{
					uni.showToast({
						title: '两次密码不一致',
						duration: 1000,
						icon: 'none'
					});
				}
			}else{
				uni.showToast({
					title: '请填写全部信息',
					duration: 1000,
					icon: 'none'
				});
			}
		}
	}
};
</script>

<style lang="scss" scoped>
.form {
	padding: 20upx 80upx;
	text-indent: 10upx;
}
.input {
	position: relative;
	
	&::after {
		content: '';
		position: absolute;
		right: 20upx;
		top: calc(50% - 16upx);
		background: url(../../static/static/password_icon.png) no-repeat center;
		width: 32upx;
		height: 32upx;
		background-size: contain;
	}
}
.button {
	height: 80upx;
	line-height: 80upx;
	text-align: center;
	border-radius: 60upx;
	margin: 60upx auto 40upx;
	display: block !important;
	color: #fff;
	margin-top: 60upx;
	background-color: #0ea2ff;
}
/deep/.uni-input-input{
 color: #fff;
}
</style>
